import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:mall/constant/app_colors.dart';
import 'package:mall/constant/app_strings.dart';
import 'package:mall/gen/r.dart';
import 'package:mall/modules/model/order_detail_entity.dart';
import 'package:mall/modules/sc/order_sc.dart';
import 'package:mall/router/navigator_util.dart';
import 'package:mall/ui/page/goods/widgets/order_goods_list_widget.dart';
import 'package:mall/ui/widgets/app_base_widgets/app_bottom_btn.dart';
import 'package:mall/ui/widgets/app_base_widgets/app_copy_btn.dart';
import 'package:mall/ui/widgets/default_bg.dart';
import 'package:mall/ui/widgets/divider_line.dart';
import 'package:mall/ui/widgets/item_text.dart';
import 'package:mall/utils/ext/string_ext.dart';
import 'package:mall/utils/image_component/image_component.dart';
import 'package:mall/utils/list_placeholder_component/list_placeholder_component.dart';

class OrderDetailPage extends StatefulWidget {
  final int orderId;

  OrderDetailPage(this.orderId);

  @override
  _OrderDetailPageState createState() => _OrderDetailPageState();
}

class _OrderDetailPageState extends State<OrderDetailPage> {
  late final sc_orderDetail = Get.put(OrderDetailSc(), tag: widget.orderId.toString());
  @override
  void initState() {
    super.initState();
    sc_orderDetail.orderId = widget.orderId;
    sc_orderDetail.refreshData();
  }

  @override
  Widget build(BuildContext context) {
    return APPScaffold(
      title: '订单详情',
      body: Obx(() => WrappedListPlaceholderComponent.widget1(
            state: sc_orderDetail.loadState.value,
            data: sc_orderDetail.data.value,
            builder: (p0) => _contentView(p0),
          )),
      bottomNavigationBar: _bttomBar(),
    );
  }

  Widget _contentView(OrderDetailEntity orderDetailEntity) {
    return SingleChildScrollView(
      padding: EdgeInsets.all(15),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          //状态
          _statu(orderDetailEntity),
          //地址
          SizedBox(height: 15),
          _addressWidget(orderDetailEntity),
          SizedBox(height: 10),
          //商品列表
          _orderGoodsWidget(orderDetailEntity),
          SizedBox(height: 10),
          _goodsPriceMessage(orderDetailEntity),
          SizedBox(height: 10),
          _billNoMessage(orderDetailEntity),
          SizedBox(height: 10),
          _options()
        ],
      ),
    );
  }

  Container _options() {
    return Container(
      decoration: BoxDecoration(
        color: AppColors.C_FFFFFF,
        borderRadius: BorderRadius.circular(10),
      ),
      padding: EdgeInsets.symmetric(vertical: 12),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Expanded(
            child: _optionBtn(
              title: '联系客服',
              backColor: AppColors.C_F7F7F7,
              titleColor: AppColors.C_222222,
              onTap: () {},
            ),
          ),
          Expanded(
            child: _optionBtn(
              title: '继续购买',
              backColor: Color(0xffFFF0F3),
              titleColor: AppColors.C_FD2C55,
              onTap: () {},
            ),
          ),
          Expanded(
            child: _optionBtn(
              title: '查看物流',
              backColor: Color(0xffFFF0F3),
              titleColor: AppColors.C_FD2C55,
              onTap: () {
                NavigatorUtil.goLogisticsPage(widget.orderId.toString());
              },
            ),
          ),
        ],
      ),
    );
  }

  Row _statu(OrderDetailEntity orderDetailEntity) {
    return Row(
      children: [
        //订单状态图片
        orderDetailEntity.orderStatusWidget,
        SizedBox(width: 5),
        //状态文字
        Text(
          orderDetailEntity.orderInfo?.orderStatusText ?? "",
          style: TextStyle(
            color: AppColors.C_222222,
            fontSize: 23,
            fontWeight: FontWeight.bold,
          ),
        ),
      ],
    );
  }

  //地址
  Widget _addressWidget(OrderDetailEntity orderDetailEntity) {
    return Container(
      decoration: BoxDecoration(
        color: AppColors.C_FFFFFF,
        borderRadius: BorderRadius.circular(15),
      ),
      padding: EdgeInsets.symmetric(horizontal: 15, vertical: 15),
      child: Row(
        children: [
          Expanded(
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                //图标
                ImageComponent(R.image.goodsDetailAddress.path, width: 14, height: 17),
                SizedBox(width: 10),
                //地址内容
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      //名称和手机号
                      Row(
                        children: [
                          Text(
                            orderDetailEntity.orderInfo?.consignee ?? "",
                            style: TextStyle(
                              color: AppColors.C_222222,
                              fontSize: 14,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                          SizedBox(width: 10),
                          Text(
                            (orderDetailEntity.orderInfo?.mobile ?? "").phoneDesensitization,
                            style: TextStyle(
                              color: AppColors.C_222222,
                              fontSize: 14,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 5),
                      //地址
                      Text(
                        orderDetailEntity.orderInfo?.address ?? "",
                        style: TextStyle(
                          color: AppColors.C_666666,
                          fontSize: 14,
                        ),
                        maxLines: 2,
                        overflow: TextOverflow.ellipsis,
                      ),
                    ],
                  ),
                )
              ],
            ),
          ),
          SizedBox(width: 15),
          //右箭头
          ImageComponent(R.image.goTo.path, width: 7, height: 12),
        ],
      ),
    );
  }

  Widget _orderGoodsWidget(OrderDetailEntity orderDetailEntity) {
    final orderGoods = orderDetailEntity.orderGoods ?? [];
    return Container(
      decoration: BoxDecoration(
        color: AppColors.C_FFFFFF,
        borderRadius: BorderRadius.circular(10),
      ),
      padding: EdgeInsets.all(15),
      child: Column(
        children: [
          //商品列表
          OrderGoodsListWidget(checkedGoodsList: orderGoods),
        ],
      ),
    );
  }

  Widget _goodsPriceMessage(OrderDetailEntity orderDetailEntity) {
    return Container(
      decoration: BoxDecoration(
        color: AppColors.C_FFFFFF,
        borderRadius: BorderRadius.circular(10),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: [
          ItemTextView(
              AppStrings.MINE_ORDER_DETAIL_TOTAL, AppStrings.DOLLAR + "${orderDetailEntity.orderInfo?.goodsPrice}"),
          DividerLineView(),
          ItemTextView(AppStrings.FREIGHT, AppStrings.DOLLAR + "${orderDetailEntity.orderInfo?.freightPrice}"),
          DividerLineView(),
          ItemTextView(AppStrings.MINE_ORDER_DETAIL_PREFERENCES,
              AppStrings.DOLLAR + "${orderDetailEntity.orderInfo?.couponPrice}"),
          DividerLineView(),
          ItemTextView(
              AppStrings.MINE_ORDER_DETAIL_PAYMENTS, AppStrings.DOLLAR + "${orderDetailEntity.orderInfo?.actualPrice}"),
          Visibility(
            child: InkWell(
              onTap: () {
                NavigatorUtil.goAfterSalePage(widget.orderId.toString());
              },
              child: Container(
                height: 32,
                width: 75,
                margin: EdgeInsets.only(right: 15, bottom: 15, top: 5),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(16),
                  border: Border.all(color: Color(0xffadadad), width: 0.5),
                ),
                alignment: Alignment.center,
                child: Text(
                  '申请售后',
                  style: TextStyle(
                    color: AppColors.C_222222,
                    fontSize: 12,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _billNoMessage(OrderDetailEntity orderDetailEntity) {
    return Container(
      decoration: BoxDecoration(
        color: AppColors.C_FFFFFF,
        borderRadius: BorderRadius.circular(10),
      ),
      padding: EdgeInsets.symmetric(horizontal: 15, vertical: 7.5),
      child: Column(
        children: [
          Row(
            children: [
              _myItem(title: '订单编号', content: orderDetailEntity.orderInfo?.orderSn),
              SizedBox(width: 10),
              //复制
              AppCopyBtn(text: orderDetailEntity.orderInfo?.orderSn ?? ''),
            ],
          ),
          Row(
            children: [
              _myItem(title: '物流编号', content: orderDetailEntity.orderInfo?.addTime),
              SizedBox(width: 10),
              //复制
              AppCopyBtn(text: orderDetailEntity.orderInfo?.orderSn ?? ''),
            ],
          ),
          _myItem(title: '下单时间', content: orderDetailEntity.orderInfo?.addTime),
          _myItem(title: '付款方式', content: '微信支付'),
        ],
      ),
    );
  }

  Widget _myItem({String? title, String? content}) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 7.5),
      child: Row(
        children: [
          Container(
            width: 90,
            child: Text(
              title ?? '',
              style: TextStyle(
                color: AppColors.C_222222,
                fontSize: 13,
              ),
            ),
          ),

          //
          Text(
            content ?? '',
            style: TextStyle(
              color: AppColors.C_222222,
              fontSize: 13,
              fontWeight: FontWeight.bold,
            ),
          )
        ],
      ),
    );
  }

  Widget _bttomBar() {
    return Obx(() {
      OrderDetailEntity? orderDetailEntity = sc_orderDetail.data.value;
      if (orderDetailEntity == null) {
        return Container();
      }
      return BottomAppBar(
        color: Colors.transparent,
        child: AppBottomBtn(
          title: '立即支付',
          onTap: () {},
        ),
      );
    });
  }

  Widget _optionBtn({
    String? title,
    Color titleColor = AppColors.C_222222,
    Color backColor = AppColors.C_F7F7F7,
    bool visible = true,
    Function()? onTap,
  }) {
    return Visibility(
      visible: visible,
      child: InkWell(
        onTap: onTap,
        child: Container(
          height: 45,
          margin: EdgeInsets.symmetric(horizontal: 12),
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10),
            color: backColor,
          ),
          alignment: Alignment.center,
          child: Text(
            title ?? '',
            style: TextStyle(
              color: titleColor,
              fontSize: 12,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
      ),
    );
  }
}
